<template>
	<view>
		<view style="font-size: 44rpx;line-height: 44rpx;margin-top: 20rpx;margin-left: 30rpx;">2022年汛前检查-村社自查统计</view>
		<view style="font-size: 28rpx;line-height: 28rpx;color: #E93B3D;margin-top: 20rpx;margin-left: 30rpx;">4月1日～4月30日截止</view>
		<view style="display: flex;" v-if="real">
			<view style="font-size: 36rpx;line-height: 36rpx;margin-left: 30rpx;margin-top: 60rpx;" >已完成村社125</view>
			<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 60rpx;margin-top: 64rpx;" @click="change">未完成村社98</view>
		</view>
		<view style="display: flex;" v-else>
			<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 30rpx;margin-top: 64rpx;" @click="changeback">已完成村社125</view>
			<view style="font-size: 36rpx;line-height: 36rpx;margin-left: 60rpx;margin-top: 60rpx;">未完成村社98</view>	
		</view>
		<scroll-view scroll-y="true" style="width: 690rpx;height: 1100rpx;margin-left: 30rpx;margin-top: 30rpx;background-color: #FFFFFF;border-radius: 16rpx;" v-if="real">
			<view v-for="(item,index) in list" :key="index">
				<view style="width: 690rpx;height: 100rpx;" @click="gotoYZC()">
					<view style="font-size: 32rpx;line-height: 32rpx;margin-top: 34rpx;margin-left: 30rpx;float: left;">{{item}}</view>
					<image src="../../../static/iconjiantou@3x.png" style="width: 40rpx;height: 40rpx;float: right;margin-top: 30rpx;margin-right: 16rpx;"></image>
					<view style="width: 122rpx;height: 36rpx;background-color: rgba(117, 188, 77, 0.12);color: #75BC4D;font-size: 24rpx;line-height: 36rpx;text-align: center;border-radius: 4rpx;margin-top: 32rpx;float: right;margin-right: 8rpx;">已自查20</view>
				</view>
				<view v-if="index !== list.length - 1 || list.length<11" style="width: 690rpx;height: 1rpx;background-color: #E5E5E5;" ></view>
			</view>
		</scroll-view>
		<scroll-view scroll-y="true" style="width: 690rpx;height: 1100rpx;margin-left: 30rpx;margin-top: 30rpx;background-color: #FFFFFF;border-radius: 16rpx;" v-else>
			<view style="width: 690rpx;height: 100rpx; " @click="gotoWZC()">
				<view style="font-size: 32rpx;line-height: 32rpx;margin-top: 34rpx;margin-left: 30rpx;float: left;">下应街道东兴社区</view>
				<image src="../../../static/iconjiantou@3x.png" style="width: 40rpx;height: 40rpx;float: right;margin-top: 30rpx;margin-right: 16rpx;"></image>
				<view style="width: 122rpx;height: 36rpx;background-color: rgba(251, 154, 23, 0.11);color: #FB9A17;font-size: 24rpx;line-height: 36rpx;text-align: center;border-radius: 4rpx;margin-top: 32rpx;float: right;margin-right: 8rpx;">待自查20</view>
				<view style="width: 122rpx;height: 36rpx;background-color: rgba(117, 188, 77,  0.12);color: #75BC4D;font-size: 24rpx;line-height: 36rpx;text-align: center;border-radius: 4rpx;margin-top: 32rpx;float: right;margin-right: 8rpx;">已自查20</view>
			</view>
			<view style="width: 690rpx;height: 1rpx;background-color: #E5E5E5;"></view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				real:true,
				list: ['a','b','c','c','c','c','c','c','c','c','c']
			}
		},
		methods: {
			change(){
				this.real=false
			},
			changeback(){
				this.real=true
			},
			gotoYZC(){
				uni.navigateTo({
					url:`ZClist?real=${''}`
				})
			},
			gotoWZC(){
				uni.navigateTo({
					url:`ZClist?real=${false}`
				})
			}
		}
	}
</script>

<style>
page{background-color: #F5F5F8;}
</style>
